<template>
	<view class="certification-pop">
		<view class="pop-shadow"></view>
		<view class="certification-pop__box">
			<image class="certification-pop__bg" :src="$imgUrl('/components/certificationpop/bg-cer.png')" mode="widthFix"></image>
			<view class="certification-pop__text">请先实名认证</view>
			<view class="certification-pop__button" @click="toCertification">去实名认证</view>
			<view class="certification-pop__cancel" @click="closeWindow">取消</view>
		</view>
	</view>
</template>

<script>
	import { mapState, mapActions } from 'vuex'
	export default {
		name: 'certificationPop',
		data() {
			return {}
		},
		computed: {
			...mapState(['userInfo'])
		},
		onLoad() {},
		methods: {
			// 跳转实名认证页面
			toCertification () {
				if (this.userInfo.authStatus == 0) {
					uni.showToast({
						title: '后台正在审核中',
						icon: 'none',
						duration: 2000,
						mask: true
					});
					return
				}
				uni.navigateTo({
					url: '/pages/mine/auther/index'
				})
			},
			// 关闭弹窗
			closeWindow () {
				this.$emit('closeWindow')
			}
		}
	}
</script>

<style scoped lang="scss">
.certification-pop {
	
	.certification-pop__box{
		position: fixed;
		left: 50%;
		top: 50%;
		z-index: 20001;
		transform: translate(-50%, -50%);
		width: 570rpx;
		height: 602rpx;
		background-color: #FFFFFF;
		border-radius: 32px;
	}
	
	.pop-shadow{
		position: fixed;
		top: 0;
		left: 0;
		z-index: 20000;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
	}
	
	.certification-pop__bg{
		width: 570rpx;
		height: 246rpx;
	}
	
	.certification-pop__text{
		font-size: 34rpx;
		font-weight: bold;
		color: #333333;
		text-align: center;
		margin: 54rpx 0;
	}
	
	.certification-pop__button{
		width: 412rpx;
		height: 80rpx;
		background: #2FCC71;
		box-shadow: 0rpx 10rpx 20rpx 0rpx rgba(47,204,113,0.25);
		border-radius: 40rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #FFFFFF;
		text-shadow: 0rpx 10rpx 20rpx rgba(47,204,113,0.25);
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
	}

	.certification-pop__cancel{
		width: 80rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #2FCC71;
		margin: 0 auto;
		margin-top: 32rpx;
		text-align: center;
	}
}
</style>